<template lang="pug">
  kalix-dialog.user-add(title='修改' bizKey="SelectesCourse" ref="kalixBizDialog" v-bind:formModel.sync="formModel" v-bind:targetURL="targetURL")
    div.el-form(slot="dialogFormSlot")
      el-form-item(label="课程名称" prop="cname" v-bind:label-width="labelWidth")
        kalix-select(v-model="formModel.cname" v-bind:requestUrl="courseURL"  placeholder="请选择课程名称"
        v-bind:paramObj="menuParam" v-bind:defaultSelect="true" v-on:selectChange="setGroup")
      el-form-item(label="授课教师" prop="uname" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.uname" readonly="readonly")
      el-form-item(label="课程简介" prop="introduction" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.introduction" readonly="readonly")
      el-form-item(label="课程要点" prop="points" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.points" readonly="readonly")
      el-form-item(label="课程图片" prop="photo" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.photo" readonly="readonly")
      el-form-item(label="课时" prop="classHour" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.classHour" readonly="readonly")
      el-form-item(label="学分" prop="credit" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.credit" readonly="readonly")
      el-form-item(label="课程类别" prop="gname" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.gname" readonly="readonly")
      el-form-item(label="院系名称" prop="dname" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.dname" readonly="readonly")
      el-form-item(label="标识" prop="identify" v-bind:label-width="labelWidth")
        el-input(v-model="formModel.identify")
</template>

<script type="text/ecmascript-6">
  import {SelectedCourseURL, CourseURL, userURL, DepartmentsURL} from '../../config.toml'
  import FormModel from './model'

  export default {
    name: 'SelectesCourseEdit',
    data() {
      return {
        labelWidth: '150px',
        formModel: Object.assign({}, FormModel),
        // rules: {
        //   cid: [{required: true, message: '请输入原住院人数', trigger: 'change'}]
        // },
        targetURL: SelectedCourseURL,
        courseURL: CourseURL,
        userURL: userURL,
        DepartmentsURL: DepartmentsURL,
        menuParam: undefined
      }
    },
    methods: {
      init(dialogOption) {
        console.log('---------dialogOption------------', dialogOption)
      },
      setGroup(item) {
        console.log('------select---item------------', item)
        this.$http.request({
          method: 'GET',
          url: userURL + `/${item.uid}`
        }).then(res => {
          this.formModel.uname = res.data.data[0].name
        })
        this.$http.request({
          method: 'GET',
          url: DepartmentsURL + `/${item.did}`
        }).then(res => {
          this.formModel.dname = res.data.content
        })
        this.formModel.cid = item.id
        this.formModel.classHour = item.classHour
        this.formModel.introduction = item.introduction
        this.formModel.points = item.points
        this.formModel.photo = item.photo
        this.formModel.credit = item.credit
      }
    }
  }
</script>

<style scoped lang="stylus" type="text/stylus">
  .el-form
    width 50%
    margin auto
    .radio
      margin-left 150px
      margin-bottom 20px
      .el-radio
        color: #3465cb
        font-weight: bold
        font-size: 14px
</style>
